// Foundation JavaScript
// Documentation can be found at: http://foundation.zurb.com/docs
$(document).foundation();

// always start at top
window.scrollTo(0, 0);

$(document).ready(function() {
	var contentShowFlg = true;
	var prevContentShowFlg = true;

	$('.what_do div.modules .module:not(:first-child)').hide();
	$('.inner div.modules_1').fadeOut(500);
	$('.what_do ul.modules li').bind('click', function() {
		$('.what_do ul.modules li').removeClass('active');
		$(this).addClass('active');
		var target = $(this).attr("data-module");
		$('.'+target+'1').hide();
		$('.inner_div_hide').fadeIn(500);
		$('.pos_ab,.pos_ab_left').fadeIn(500);
		$('.close_div,.close_div_left').fadeIn(500);
		//$('.pos_ab').addClass('fadeInRight animated');
		//$(".close_div").addClass('fadeInRight animated');
		//$('.phone').css('z-index','10');
		$('.close_div,.close_div_left').css('z-index','20');
		$('.pos_ab,.pos_ab_left').css('z-index','19');
		$('.pos_ab,.pos_ab_left').css('position','fixed');
		var moduleArr = target.split("-");
		var digitId = 0;
		if( moduleArr.length == 2 )
		{
			digitId = moduleArr[1];
		}
		$('.maincontent-1,.maincontent-2,.maincontent-3,.maincontent-4,.maincontent-5,.maincontent-6,.maincontent-7,.maincontent-8').fadeIn(500);
		$('.what_do div.modules .module:visible').stop().fadeOut(500, function() {
			$('.what_do div.modules .module.' + target).fadeIn(500);
		});
		contentShowFlg = true;
		if( $('.maincontent-' + digitId).length )
		{
			if( $('.maincontent-' + digitId).html().trim() == "" )
			{
				contentShowFlg = false;
			}
		}
		if( prevContentShowFlg )
		{
			$('.pos_ab').removeClass('fadeInRight animated').addClass('fadeOutRight animated');
			$('.pos_ab_left').removeClass('fadeInLeft animated').addClass('fadeOutLeft animated');
			$('.close_div').removeClass('fadeInRight animated').addClass('fadeOutRight animated');
			$('.close_div_left').removeClass('fadeInLeft animated').addClass('fadeOutLeft animated');
		}
		if( contentShowFlg )
		{
			setTimeout(function() {
				$('.pos_ab').removeClass('fadeOutRight animated').addClass('fadeInRight animated');
				$('.pos_ab_left').removeClass('fadeOutLeft animated').addClass('fadeInLeft animated');
				$('.close_div').removeClass('fadeOutRight animated').addClass('fadeInRight animated');
				$('.close_div_left').removeClass('fadeOutLeft animated').addClass('fadeInLeft animated');
			}, 500);
		}
		prevContentShowFlg = contentShowFlg;
		$("li[id^='gray_']").each(function(){
			var childId="";
			var selectId = this.id;
			var selectClass = $('#'+selectId).attr('class');
			if(selectClass=='active'){
				$('#'+selectId).css('background','#00b0f0');
				var childIds=selectId.split('_');
				childId=childIds[1];
				$('.child_gray_'+childId).css('background','#00b0f0');
			}else{
				$('#'+selectId).css('background','#a6a6a6');
			}
		});
		
		$("li[class^='child_gray_']").each(function(){
			var selectCId = this.id;
			$( "#"+selectCId ).click(function() {
				var selectCClass = $('#'+selectCId).attr('class');
				var classFinal=selectCClass.replace(' active','');
				$('.'+classFinal).css('background','#a6a6a6');
				$('#'+selectCId).css('background','#00b0f0');
			});
		});
		
	});

	$('.inner_div_hide').fadeOut(500);
	$('.inner div.modules_1 .module:not(:first-child)').hide();
	$('.inner ul.modules_1 li').bind('click', function() {
		$('.inner div.modules_1').fadeIn(500);
		$('.inner ul.modules_1 li').removeClass('active');
		$(this).addClass('active');
		var target = $(this).attr("data-module");
			$('.inner div.modules_1 .module.' + target).fadeIn(500);
		$('.maincontent-1,.maincontent-2,.maincontent-3,.maincontent-4,.maincontent-5,.maincontent-6,.maincontent-7,.maincontent-8').fadeOut(500);
		//$('.pos_ab').fadeIn(500);
		//$(".close_div").fadeIn(500);
		$('.inner div.modules_1 .module:visible').stop().fadeOut(500, function() {
			$('.inner div.modules_1 .module.' + target).fadeIn(500);
		});

		var innerModuleArr = target.split("-");
		var innerDigitId = 0;
		if( innerModuleArr.length == 2 )
		{
			innerDigitId = innerModuleArr[1];
		}
		var innerContentShowFlg = true;
		if( $('.module-' + innerDigitId).length )
		{
			if( $('.module-' + innerDigitId).html().trim() == "" )
			{
				innerContentShowFlg = false;
			}
		}
		$('.pos_ab').removeClass('fadeInRight animated').addClass('fadeOutRight animated');
		$('.pos_ab_left').removeClass('fadeInLeft animated').addClass('fadeOutLeft animated');
		$('.close_div').removeClass('fadeInRight animated').addClass('fadeOutRight animated');
		$('.close_div_left').removeClass('fadeInLeft animated').addClass('fadeOutLeft animated');
		$('.inner .device').removeClass('fadeInRight animated').addClass('fadeOutRight animated');
		if( innerContentShowFlg )
		{
			setTimeout(function() {
				$('.pos_ab').removeClass('fadeOutRight animated').addClass('fadeInRight animated');
				$('.pos_ab_left').removeClass('fadeOutLeft animated').addClass('fadeInLeft animated');
				$('.close_div').removeClass('fadeOutRight animated').addClass('fadeInRight animated');
				$('.close_div_left').removeClass('fadeOutLeft animated').addClass('fadeInLeft animated');
			}, 500);
		}
	});
//End
	var direction = 'down';
	var last_pane = $('.pane.active').attr('id');
	var is_mobile = false;

	function transitionNext(from_scroll) {

		if ($('.pane.transitioning').length > 0) {
			return;
		}

		if (last_pane != $('.pane.next').attr('id')) {

			// next will be the last pane
			last_pane = $('.pane.next').attr('id');

			// front pane will transition, move to top
			$('.pane.active').addClass('transitioning').removeClass('active');

			// next pane becomes active
			$('.pane.next').addClass('active fixed').removeClass('next');

			// recalc filler pane
			recalcFiller();

			// set scrollbar position
			if (!is_mobile) {
				$(window).scrollTop(jump_points[last_pane]);
			} else if (is_mobile && !from_scroll) {
				// if is mobile and not using click nav
				$("html, body").animate({
					scrollTop: jump_points[last_pane]-60
				});
			}

			// what's next pane?
			detectNext(false);

			// switch active nav item
			if ($('nav .right li a[href=#' + last_pane + ']').length == 1) {
				$('nav .right li').removeClass('active');
				$('nav .right li a[href=#' + last_pane + ']').closest('li').addClass('active');

			}

			// if mobile, run this and stop
			if (is_mobile) {
				// remove classes
				$('.pane').removeClass('fixed transitioning').show();

				// active pane should be the only one fixed
				$('.pane.active').addClass('fixed');

				// toggle corner nav arrow direction
				if ($('.pane.active').is('.pane:last')) {
					$('.corner_nav i').removeClass('fa-caret-down').addClass('fa-caret-up');
				} else {
					$('.corner_nav i').removeClass('fa-caret-up').addClass('fa-caret-down');
				}

				return;
			}

			// remove prev animations
			$('.animated').removeClass('animated fadeInUp fadeInDown fadeInRight fadeInLeft fadeOutUp zoomIn zoomOut fadeOutUp fadeOutDown fadeOutLeft fadeOutRight');

			// animate out
			if (direction == 'down') {
				$('.pane.transitioning .animateUp').addClass('fadeOutUp animated');
			} else {
				$('.pane.transitioning .animateUp').addClass('fadeOutDown animated');
			}
			$('.pane.transitioning .animateZoom').addClass('zoomOut animated');
			$('.pane.transitioning .animateFromRight').addClass('fadeOutRight animated');
			$('.pane.transitioning .animateFromLeft').addClass('fadeOutLeft animated');

			// animate in
			if (direction == 'down') {
				$('.pane.active .animateUp').addClass('fadeInUp animated');
			} else {
				$('.pane.active .animateUp').addClass('fadeInDown animated');
			}
			$('.pane.active .animateZoom').addClass('zoomIn animated');
			$('.pane.active .animateFromRight').addClass('fadeInRight animated');
			$('.pane.active .animateFromLeft').addClass('fadeInLeft animated');

			// phone animation
			var active_slide = $('.pane.active').attr('id');
			if (active_slide == 'home') {
				$('.what_do').css('z-index','19');
				$('.hand').transition({
					y: 0,
					opacity:1
				}, 500);
				$(".phone .device").transition({
					opacity: 1,
					scale: 1,
					y: 0,
					rotate: '0deg'
				}, 500);
				$(".free-coffee").transition({
					opacity: 0,
					scale: 0
				}, 500);
				$('.screen2, .screen3').hide();
				$('.phone').show(); 
			} else if (active_slide == 'how') {
				$('.pos_ab,.pos_ab_left').fadeOut(500);
				$('.close_div,.close_div_left').fadeOut(500);
				$('.inner_div_hide').fadeOut(500);
				$('.what_do').css('z-index','21');
				$("li[id^='gray_']").each(function(){
					var childId="";
					var selectId = this.id;
					var selectClass = $('#'+selectId).attr('class');
						$('#'+selectId).css('background','#00b0f0');
				});
				$('.hand').transition({
					y: 638
				}, 1000);
				$(".phone .device").transition({
					opacity: 1,
					scale: 1.2,
					y: 100,
					rotate: '0deg'
				}, 500);
				$(".free-coffee").transition({
					opacity: 0,
					scale: 0
				}, 500);
				$('.screen3:visible').fadeOut(500);
				$('.screen2').fadeIn(500);
				$('.phone').show();
			} else if (active_slide == 'how2') {
			$('.what_do').css('z-index','19');
				$('.hand').transition({
					y: 638
				}, 1000);
				$(".phone .device").transition({
					opacity: 1,
					scale: 1,
					y: 0,
					rotate: '-15deg'
				}, 1000);
				$(".free-coffee").transition({
					opacity: 0,
					scale: 0
				}, 500);
				$('.screen3').css({
					top:-437
				});
				$('.screen3').fadeIn(500);
				$('.phone').show();
			} else if (active_slide == 'how3') {
				$('.what_do').css('z-index','19');
				$('.hand').transition({
					y: 638
				}, 1000);
				$(".phone .device").transition({
					opacity: 1,
					scale: 1,
					y: 0,
					rotate: '-15deg'
				}, 1000);
				$(".free-coffee").transition({
					opacity: 1,
					scale: 1
				}, 500);
				$('.screen3').animate({
					top:0
				}, 1000);
				$('.phone').show();
			} else if (active_slide == 'casestudies') {
			$('.what_do').css('z-index','19');
				$('.hand').transition({
					y: 638
				}, 1000);
				$(".phone .device").transition({
					opacity: 0,
					scale: 1,
					y: 0,
					rotate: '-15deg'
				}, 1000);
				$(".free-coffee").transition({
					opacity: 0,
					scale: 0
				}, 500);
				$('.phone').hide();
			} else {
				$('.what_do').css('z-index','19');
				$(".hand, .device, .free-coffee").transition({
					opacity: 0
				});
				$('.phone').hide();
			}

			// transition
			$('.pane.transitioning').stop().fadeOut(1000, function() {

				// remove classes
				$('.pane').removeClass('fixed transitioning').show();

				// active pane should be the only one fixed
				$('.pane.active').addClass('fixed');

				// recalc filler pane
				recalcFiller();

				// set scrollbar position
				$(window).scrollTop(jump_points[last_pane]);

				// toggle corner nav arrow direction
				if ($('.pane.active').is('.pane:last')) {
					$('.corner_nav i').removeClass('fa-caret-down').addClass('fa-caret-up');
				} else {
					$('.corner_nav i').removeClass('fa-caret-up').addClass('fa-caret-down');
				}
			});
		}
	}

	function detectNext(from_scroll) {

		$('.pane').removeClass('next');

		// detect direction
		if (direction == 'down'){
			// down
			if ($('.pane.active').is('.pane:last')) {
				$('.pane:first').addClass('next');
			} else {
				$('.pane.active').nextAll('.pane').first().addClass('next');
			}
		} else {
			// up
			if (!$('.pane.active').is('.pane:first')) {
				$('.pane.active').prevAll('.pane').first().addClass('next');
			} else {
				$('.pane.active').nextAll('.pane').first().addClass('next');
			}
		}

	}

	function recalcFiller() {
		$('.filler').height(0);
		$('.pane.fixed').each(function() {
			$(this).prev('.filler').height($(this).height());
		});
	}

	var jump_points = {};

	function init() {
		$('.pane > .row > .columns, .pane .row').css('height', 'auto');
		is_mobile = false;

		if ($(window).width() > 640) {
			$('.pane:not(#features)').each(function() {
				$('> .row > .columns', this).css('height', $(this).closest('.pane').outerHeight()+1);
			});
		} else {
			is_mobile = true;
		}

		if ($(window).width() < 1025) {
			$('.pane > .row').height($(window).height()-60);
		}

		recalcFiller();

		$('.pane').each(function() {
			var pos = $(this).offset().top;
			var id = $(this).attr('id');
			jump_points[id] = pos;
		});
	}


	var lastScrollTop = 0;

	$(document).scroll(function() {
		if (!is_mobile) {
			return;
		}

		var cutoff_actual = $(window).scrollTop();
		cutoff = cutoff_actual;

		// detect direction
		if (cutoff > lastScrollTop) {
			direction = 'down';
		} else if (cutoff < lastScrollTop) {
			direction = 'up';
		}

		// save position to detect direction
		lastScrollTop = cutoff_actual;

		detectNext(true);

		var next_pane = $('.pane.next').attr('id');

		// if next is first, do nothing
		if (direction == 'down' && $('.pane.active').is('.pane:last')) {
			return;
		}

		// if next is last, do nothing
		if (direction == 'up' && $('.pane.active').is('.pane:first')) {
			return;
		}

		if ((direction == 'down' && (jump_points[next_pane] - 60) <= cutoff) || (direction == 'up' && (jump_points[next_pane] + $('.pane.next').height() - 60) >= cutoff)) {
			transitionNext(true);
			return;
		}

	});

	$(document).mousewheel(function() {

		if (is_mobile) {
			return;
		}

		var cutoff_actual = $(window).scrollTop();
		cutoff = cutoff_actual;

		// detect direction
		if (cutoff > lastScrollTop) {
			direction = 'down';
			if ($('.pane.active').is('.pane:first')) {
				cutoff += $('.pane:first').height() + 30;
			} else {
				cutoff += $('.pane:first').height() - 30;
			}
		} else if (cutoff < lastScrollTop) {
			direction = 'up';
			cutoff -= $('.pane:first').height() - 30;
		}

		// save position to detect direction
		lastScrollTop = cutoff_actual;

		detectNext(false);

		clearTimeout($.data(this, 'scrollTimer'));
    	$.data(this, 'scrollTimer', setTimeout(function() {

			var next_pane = $('.pane.next').attr('id');

			// if next is first, do nothing
			if (direction == 'down' && $('.pane.active').is('.pane:last')) {
				return;
			}

			// if next is last, do nothing
			if (direction == 'up' && $('.pane.active').is('.pane:first')) {
				return;
			}

			if ((direction == 'down' && jump_points[next_pane] <= cutoff) || (direction == 'up' && jump_points[next_pane] >= cutoff)) {
				transitionNext(true);
				return;
			}

		}, 25));
	});

	$('.corner_nav').click(function() {
		direction = 'down';
		detectNext(false);
		transitionNext(false);
		return false;
	});

	// arrow keys
	$(document).keydown(function(e) {
		if (e.keyCode == 38) {
			direction = 'up';
			if ($('.pane.active').is('.pane:first')) {
				return;
			}
			detectNext(false);
			transitionNext(false);
		} else if (e.keyCode == 40) {
			direction = 'down';
			detectNext(false);
			transitionNext(false);
		}
	});

	// top nav
	$('nav .name a, nav .right a').click(function() {
		$('.sticky.fixed, .top-bar').removeClass('expanded');
		var target = $(this).attr('href');
		if (!$(target).hasClass('active')) {
			$('.pane').removeClass('next');
			$(target).addClass('next');
			transitionNext(false);
		}
		return false;
	});

	$('#features .items .columns').matchHeight();

	$('.pane').before('<div class="filler"></div>');

	init();

	$(window).resize(function() {
		init();
	});

//Nick added this to jump navigation on button press

$('.pane a[href^=#]').click(function() {
  $('.pane').removeClass('next');
  $($(this).attr('href')).addClass('next');
  transitionNext(false);
  return false;
 });

});


